export class TemperatureChartConfig {
  static create(data: any[]) {
    return {
      backgroundColor: 'transparent',
      grid: {
        top: '15%',
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
      },
      xAxis: {
        type: 'category',
        data: data.map(item => item.time),
        axisLine: { lineStyle: { color: 'rgba(0, 212, 255, 0.5)' } },
        axisLabel: { color: 'rgba(255, 255, 255, 0.7)', fontSize: 10 }
      },
      yAxis: {
        type: 'value',
        name: '温度(°C)',
        nameTextStyle: { color: 'rgba(255, 255, 255, 0.7)' },
        axisLine: { lineStyle: { color: 'rgba(0, 212, 255, 0.5)' } },
        splitLine: { lineStyle: { color: 'rgba(0, 212, 255, 0.1)' } },
        axisLabel: { color: 'rgba(255, 255, 255, 0.7)', fontSize: 10 }
      },
      series: [{
        data: data.map(item => item.value),
        type: 'line',
        smooth: true,
        symbol: 'emptyCircle',
        symbolSize: 4,
        itemStyle: { color: '#ff6b6b' },
        lineStyle: { color: '#ff6b6b', width: 2 }
      }]
    }
  }
}

export class HumidityGaugeConfig {
  static create(value: number) {
    return {
      backgroundColor: 'transparent',
      series: [{
        type: 'gauge',
        radius: '70%',
        startAngle: 180,
        endAngle: 0,
        min: 0,
        max: 100,
        splitNumber: 5,
        axisLine: {
          lineStyle: {
            width: 10,
            color: [[1, '#67e0e3']]
          }
        },
        pointer: {
          icon: 'path://M12.8,0.7l12,40.1H0.7L12.8,0.7z',
          length: '60%',
          width: 8,
          offsetCenter: [0, '-60%'],
          itemStyle: { color: '#67e0e3' }
        },
        axisTick: {
          length: 8,
          lineStyle: { color: '#67e0e3', width: 2 }
        },
        splitLine: {
          length: 15,
          lineStyle: { color: '#67e0e3', width: 3 }
        },
        axisLabel: {
          color: '#67e0e3',
          fontSize: 12,
          distance: -40
        },
        title: {
          offsetCenter: [0, '-20%'],
          fontSize: 20,
          color: '#67e0e3'
        },
        detail: {
          fontSize: 16,
          offsetCenter: [0, '0%'],
          valueAnimation: true,
          formatter: function (value: number) {
            return Math.round(value) + '%'
          },
          color: '#67e0e3'
        },
        data: [{ value: value, name: '湿度' }]
      }]
    }
  }
}

export class EnvironmentRadarConfig {
  static create(data: number[]) {
    return {
      backgroundColor: 'transparent',
      radar: {
        indicator: [
          { name: '空气质量', max: 100 },
          { name: '温度', max: 150 },
          { name: '湿度', max: 100 },
          { name: '光照', max: 100 },
          { name: '紫外线', max: 100 },
          { name: '气压', max: 100 }
        ],
        axisName: {
          color: '#00d4ff',
          fontSize: 12
        },
        splitLine: {
          lineStyle: {
            color: 'rgba(0, 212, 255, 0.2)'
          }
        },
        axisLine: {
          lineStyle: {
            color: 'rgba(0, 212, 255, 0.5)'
          }
        }
      },
      series: [{
        type: 'radar',
        data: [{
          value: data,
          name: '环境指标',
          symbol: 'circle',
          symbolSize: 4,
          itemStyle: { color: '#6c5ce7' },
          lineStyle: { color: '#6c5ce7', width: 2 },
          areaStyle: { color: 'rgba(108, 92, 231, 0.3)' }
        }]
      }]
    }
  }
}

export class EnergyBarConfig {
  static create(categories: string[], buildings: string[], data: number[][]) {
    return {
      backgroundColor: 'transparent',
      legend: {
        data: buildings,
        textStyle: { color: '#00d4ff' },
        top: '5%'
      },
      grid: {
        top: '20%',
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
      },
      xAxis: {
        type: 'category',
        data: categories,
        axisLine: { lineStyle: { color: 'rgba(0, 212, 255, 0.5)' } },
        axisLabel: { color: 'rgba(255, 255, 255, 0.7)', fontSize: 10 }
      },
      yAxis: {
        type: 'value',
        name: '用量(kWh)',
        nameTextStyle: { color: 'rgba(255, 255, 255, 0.7)' },
        axisLine: { lineStyle: { color: 'rgba(0, 212, 255, 0.5)' } },
        splitLine: { lineStyle: { color: 'rgba(0, 212, 255, 0.1)' } },
        axisLabel: { color: 'rgba(255, 255, 255, 0.7)', fontSize: 10 }
      },
      series: buildings.map((building, index) => ({
        name: building,
        type: 'bar',
        data: data[index],
        itemStyle: {
          color: ['#ff6b6b', '#67e0e3', '#ffd93d'][index % 3]
        },
        barWidth: '20%'
      }))
    }
  }
}
